<template>
	<view>
		<view class="page"></view>
		<view class="Money-content">
			<view class="Money-content-box">
				<view class="Moeny-title">
					<text>我的资产</text>
					<view class="right"></view>
				</view>
				<view class="Moeny-title">
					<view class="Moeny-title-text">
						<text>账户余额(元)</text>
						<text>32，563.48</text>
					</view>
					<text>提现</text>
				</view>
				<view class="line"></view>
				<view class="card-content">
					<view class="card-text-box">
						<text>银行卡</text>
						<text>3张</text>
					</view>
					<view class="card-text-box">
						<text>优惠卷</text>
						<text>6张</text>
					</view>
				</view>
				<view class="line"></view>
				<view class="card-content">
					<view class="card-text-box">
						<text>租金卡</text>
						<text>无</text>
					</view>
					<view class="card-text-box">
						<text>我的红包</text>
						<text>无</text>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
</script>

<style>
	.page{
		background-color: #666EE8;height: 300upx;
	}
	.Money-content {
		
	}
	.Money-content .Money-content-box {
		height: 240px;
		position: fixed;
		width: 90%;
		box-shadow: 1upx 1upx 10upx #5e5e5e;
		background-color: rgba(255, 255, 255, 1);
		border-radius: 16upx;
		top: 145upx;
		left: 5%;
		font-family: Arial, Helvetica, sans-serif;
	}
	.Money-content-box .Moeny-title{
		font-size: 28upx;
		display: flex;
		justify-content: space-between;
		padding: 30upx 30upx 7upx 30upx;
		align-items: flex-end;
		font-family: Arial, Helvetica, sans-serif;
	}
	.Money-content-box .Moeny-title .Moeny-title-text text:nth-child(1){
		display: flex;
		flex-direction: column;
		color: #CCCCCC;
		font-size: 24upx;
	}
	.Money-content-box .Moeny-title .Moeny-title-text text:nth-child(2){
		font-size: 40upx;
		display: flex;
		flex-direction: column;
		color: #333333;
		font-weight: bolder;
	}
	.line{
		border-bottom: 1upx solid #F2F2F2;
	}
	.right{
		width: 14upx;
		height: 14upx;
		border-top: 4upx solid #666EE8;
		border-right: 4upx solid #666EE8;
		transform: rotate(45deg);
		margin-bottom: 10upx;
	}
	.Money-content-box .Moeny-title text:nth-child(2){
		font-size: 40upx;
		color: #FF6262;
		font-weight: bolder;
	}
	.Money-content-box .card-content view:nth-child(1){
		border-right: 1upx solid #F2F2F2;
		width: 168px;height: 60px;display: flex;flex-direction: column;
	}
	.Money-content-box .card-content view:nth-child(2){
		margin-left: 30upx;
		width: 168px;height: 60px;display: flex;flex-direction: column;
	}
	.card-content{
		display: flex;
		flex-grow:1;
		padding: 0 30upx;
	}
	.card-content .card-text-box{
		padding-top: 20upx;
	}
	.card-content .card-text-box text:nth-child(1){
		font-family: Arial, Helvetica, sans-serif;
		font-size: 26upx;
		color: #333333;
	}
	.card-content .card-text-box text:nth-child(2){
		margin-top: 10upx;
		font-family: Arial, Helvetica, sans-serif;
		font-size: 24upx;
		color: #CCCCCC;
	}
</style>
